<#include "head_bus.ftl">
<script>
window.onload=function(){
	$("title").html("我的业务");
}
</script>
<!--内容开始-->
<div class="container">
    <!-- 选项卡组件-->
    <ul id="myTab" class="nav nav-tabs pt30 f17" role="tablist">
        <li class="active"><a href="#order" role="tab" data-toggle="tab">订单管理</a></li>
        <!--<li><a href="#business" role="tab" data-toggle="tab">业务详情</a></li>-->
        <li><a href="${BASE_PATH}/order/business_detail.htm" target="_blank">业务详情</a></li>
    </ul>
    <!-- 选项卡面板 -->
    <div id="myTabContent" class="tab-content pt50">
        <!-- 订单管理 -->
        <div class="tab-pane fade  in active" id="order">
        	<form id="serachForm"  action="${BASE_PATH}/order/business.htm">
             <div class="c-menu c-menu-2"> 
                <span class="input-group">
                    <label class="fl">订单编号：</label>
                    <input type="text" name="order_num" id="order_num" class="form-control  int-110" value="${order_num!''}" />
                </span>              
                <span class=" input-group input-prepend">
                    <label class="fl">&nbsp;&nbsp;&nbsp;&nbsp;生成日期：</label>
                    <input type="text" name="start_date1" id="start_date1" class="Wdate int-110" onClick="WdatePicker({dateFmt:'MM/dd/yyyy'})" value="${start_date1!''}" placeholder="请选择日期"/>
                    <i class="fl">--</i>
                    <input type="text" name="end_date1" id="end_date1" class="Wdate int-110 ml101" onClick="WdatePicker({dateFmt:'MM/dd/yyyy'})" value="${end_date1!''}" placeholder="请选择日期"/>
                </span>                  
                <span class="c-menu-r">
                    <label class="fl">订单状态：</label>
                    <select name="status" id="status" class="form-control-inline select-2">
                        <option value="5" <#if (status!'')=='5' >selected</#if> >全部</option>
                        <option value="0" <#if (status!'')=='0' >selected</#if> >待审核</option>
                        <option value="1" <#if (status!'')=='1' >selected</#if> >待付款</option>
                        <option value="2" <#if (status!'')=='2' >selected</#if> >已付款</option>
                        <option value="3" <#if (status!'')=='3' >selected</#if> >已生效</option>
                        <option value="7" <#if (status!'')=='7' >selected</#if> >已取消</option>
                        
                    </select>               
                </span>
                 <span class="c-menu-r">
                	<label class="fl">业务类型：</label>
                    <select name="business_type" id="business_type" class="form-control-inline select-2">
                        <option value="0" <#if (business_type!'')=='0' >selected</#if> >全部</option>
                        <option value="1" <#if (business_type!'')=='1' >selected</#if> >ISP</option>
                        <option value="2" <#if (business_type!'')=='2' >selected</#if> >IDC</option>
                    </select>               
                </span>                
                <button type="submit" class="submit btn btn-100">查询</button>   
            </div>
           </form>
            <div class="c-data mb70">
                <table>
                    <thead>
                        <tr>
                            <th width="20%">订单号</th>
                            <th width="15%">业务类型</th>
                            <th width="20%">生成日期</th>
                            <th width="15%">订单状态</th>
                            <th width="30%">操作</th>
                        </tr>
                    </thead>
                    <tbody>
                        <#list orderListInfo as one>
                        <tr>
                            <td>${one.order_num}</td>
                            <td>${one.type}</td>
                            <td>${one.create_time}</td>
                            <#if one.status==0>
                               <td>待审核</td>
                             </#if>
                            <#if one.status==1>
                               <td>待付款</td>
                             </#if>
                            <#if one.status==2>
                               <td>已付款</td>
                             </#if>
                             <#if one.status==3>
                               <td>已生效</td>
                             </#if>
                             <#if one.status==7>
                               <td>已取消</td>
                             </#if>
                             
                            <td>
                                <!--<a href="###" class="btn btn-w" data-toggle="modal" data-target="#modal-23" data-dismiss="modal" data-backdrop="static">详情</a>-->
                                <!--<a href="###" class="btn btn-w" onclick="<#assign current_order = one> $('#modal-23').modal('show')">详情</a>-->
                                <a href="${BASE_PATH}/order/orderdetail.htm?ordertype=${one.type}&orderid=${one.order_id}" target="_blank" class="btn btn-w  btn-t" >详情</a>
                                <#if one.status==0>
                                	<button href="###" class="btn btn-w  btn-t" disabled  data-toggle="modal" data-target="#modal-24" data-dismiss="modal" data-backdrop="static">付款</button>
                                </#if>
                               <#if one.status==1>
                                	<button  class="btn btn-w btn-t " onclick="pay_process('${one.type}','${one.order_id}')">付款</button>
                                </#if>
                               <#if one.status==2>
                                	<button  class="btn btn-w btn-t" onclick="ordertype='${one.type}';orderid='${one.order_id}';goto_contract()">签署合同</button>
                                </#if>
                                <#if one.status==3>
                                	<button  class="btn btn-w btn-t" disabled>已生效</button>
                                </#if>
                                <#if one.status==7>
                                	<button  class="btn btn-w btn-t" disabled>已取消</button>
                                </#if>
                                <#if one.status==0 || one.status==1> 
                                	<!--<a  class="btn btn-w"  data-toggle="modal" data-target="#modal-26" data-dismiss="modal" data-backdrop="static">取消</a>-->
                                	<a  class="btn btn-w btn-t"  onclick="ordertype='${one.type}';orderid='${one.order_id}';$('#modal-26').modal('show');">取消</a>
                                </#if>
                            </td>
                        </tr>
                        </#list>
                  </tbody>
                </table>
            </div>  
           <script type="text/javascript"> 
                var ordertype;  //使用全局变量传输订单类型到后台
                var orderid;
                function order_detail(ordernum)
                {
                	var size = '${orderListInfo?size}';
                	<#list orderListInfo as one>
                	
                	    if(ordernum == '${one.order_num}')
                	         <#assign current_order = one>;
                	</#list>
                	
                	$('#modal-23').modal('show');
                }
                function concelOrder()
                {
            	      $.ajax({
	            		cache: true,
	            		type: "POST",
	            		url:"${BASE_PATH}/order/concel_order.json",
	           			dataType : 'json',
	           			 data:{type:ordertype,order_id:orderid},
	           			 async: false,
	            		success: function(data)
	            		{
	               			if(data.result)
	               			{
            					 alert("订单取消成功");
            					 window.location.reload();
                    		}
	              			 else
	               			{
	               	  			for(var one in data.errors)
	                  			alert(data.errors[one]);	
	               			}
	           			}
	        		});
                    }
            	function pay_process(orderType,orderId)
            	{
            		ordertype = orderType;
            		orderid = orderId;
            		$.ajax({
	            		cache: true,
	            		type: "POST",
	            		url:"${BASE_PATH}/user/isSetPayPwd.json",
	           			dataType : 'json',
	           			async: false,
	            		success: function(data)
	            		{
	               			if(!data.result)
	               			{
            					// $('#modal-25').modal('show');
            					alert("您未设置支付密码，请点击确定跳转向设置支付密码页面！");
            					window.location.href="${BASE_PATH}/user/setPayPwd.htm";
            					//goto_contract();
                    		}
	              			 else
	               			{
	               				$('#modal-24').modal('show');
	               			}
	           			}
	        		});
            	}
            	function payorder()
            	{
            	      $.ajax({
	            		cache: true,
	            		type: "POST",
	            		url:"${BASE_PATH}/order/payorder.json",
	           			dataType : 'json',
	           			 data:{type:ordertype,order_id:orderid},
	           			 async: false,
	            		success: function(data)
	            		{
	               			if(data.result)
	               			{
            					// $('#modal-25').modal('show');
            					alert("订单支付成功，谢谢！点击确定后转向合同签署页面！");
            					goto_contract();
                    		}
	              			 else
	               			{
	               	  			for(var one in data.errors)
	                  			alert(data.errors[one]);	
	               			}
	           			}
	        		});
              	
            	}
            	function verify_userinfo()
            	{
            		  
            	      $.ajax({
	            		cache: true,
	            		type: "POST",
	            		url:"${BASE_PATH}/user/verify_userinfo.json",
	           			dataType : 'json',
	           			data:{zhifumima:"df"},	           			
	           			async: false,
	            		success: function(data)
	            		{
	               			if(data.result)
	               			{
	               			    
           						payorder();
                    		}
	              			 else
	               			{
	               	  			alert("您的个人用户信息不全，请先完善个人用户信息");
	                  			window.location.href="${BASE_PATH}/user/userInfoPage.htm";	
	               			}
	           			}
	        		});
             	}
            	function verify_zfmm()
            	{
            	       var zfmm =$('#zhifumima').val();
            	      $.ajax({
	            		cache: true,
	            		type: "POST",
	            		url:"${BASE_PATH}/user/verify_zfmm.json",
	           			dataType : 'json',
	           			 data:{zhifumima:zfmm},
	           			 async: false,
	            		success: function(data)
	            		{
	               			if(data.result)
	               			{
           						$('#modal-24').modal('hide');
           						verify_userinfo();
                    		}
	              			 else
	               			{
	               	  			for(var one in data.errors)
	                  			alert(data.errors[one]);	
	               			}
	           			}
	        		});
            	}
            	function goto_contract()
            	{
            	    $('#modal-25').modal('hide');
            	    window.location.href="${BASE_PATH}/contract/contractPage.htm?ordertype="+ordertype+"&orderid="+orderid;
            	}
            </script>
            <!-- 页码 -->
            <center>
                                        共${totalCount}条记录, ${pageNo}/${pages} 页
				<#if (pageNo?int>1) >
					 <a class="pageLink" onclick="gotopage('${pageNo-1}')"  href="#">上一页</a> 
				</#if>
				<#if (pageNo>1) >
					 <a class="pageLink" onclick="gotopage('1')"  href="#">首页</a> 
				</#if>
       		<#if (pages>0) >
				<#list 1..pages as one>
					<#if (pageNo-one)==3>
						 ... 
					<#elseif ((pageNo-one)<=2 && (pageNo-one)>=1) >
						 <a class="pageLink" onclick="gotopage('${one}')"  href="#">${one}</a> 
					<#elseif pageNo==one>
						 ${one}  
					<#elseif  ((one-pageNo)<=2 && (one-pageNo)>=1) >
						 <a class="pageLink"  onclick="gotopage('${one}')"  href="#">${one}</a> 
					<#elseif (one-pageNo)==3>
						 ... 
					</#if>
				</#list>
			</#if>
			<#if pageNo<pages >
				 <!--<a class="pageLink" href="${BASE_PATH}/order/business.htm?pageNo=${pageNo++1}">下一页</a>--> 
				 <a  onclick="gotopage('${pageNo++1}')" href="#">下一页</a> 
			</#if>
            </center>           
        </div>
     </div>
 <script type="text/javascript"> 
 function gotopage(page_no)
 {
     
     window.location.href = "${BASE_PATH}/order/business.htm?pageNo=" + page_no + "&status=" + $("#status").val()
                            +"&order_num=" + $("#order_num").val() +"&start_date1=" + $("#start_date1").val()
                            +"&end_date1=" + $("#end_date1").val() + "&business_type=" + $("#business_type").val();
//     alert( window.location.href);
 }
 </script>
</div>

<!-- 弹出层 -->
<!-- 详情 -->
<div class="modal fade" id="modal-23">
    <div class="modal-dialog modal-870">
        <div class="modal-content plr2">
           <div class="modal-header noborder">
               <a class="close" data-dismiss="modal">×</a>   
           </div>
           <div class="modal-body pt0 ">
                <h3 class="title-1"><span>订单信息</span></h3>
                <div class="d-data">
                  <label class="col-sm-2 col-xs-5 ">订单编号：</label>
                  <div class="col-sm-7  col-xs-7 "><#if current_order??>${current_order.order_num!""}</#if></div>
                </div> 
                 <div class="d-data">
                  <label class="col-sm-2 col-xs-5">提交时间：</label>
                  <div class="col-sm-7  col-xs-7"><#if current_order??>${current_order.create_time!""}</#if></div>
                </div>  
                <div class="d-data">
                  <label class="col-sm-2 col-xs-5">订单状态：</label>
                  <div class="col-sm-7  col-xs-7">
                            <#if current_order.status==0>
                               <td>待审核</td>
                             </#if>
                            <#if current_order.status==1>
                               <td>待付款</td>
                             </#if>
                            <#if current_order.status==2>
                               <td>已付款</td>
                             </#if>
                             <#if current_order.status==3>
                               <td>已完成</td>
                             </#if>
                             <#if current_order.status==7>
                               <td>已取消</td>
                             </#if>
                        </div>
                </div>                                        
                <h3 class="title-1"><span>客户信息</span></h3>
                <div class="d-data">
                  <label class="col-sm-2 col-xs-5 ">客户名称：</label>
                  <div class="col-sm-7  col-xs-7 ">刘晶</div>
                </div> 
                 <div class="d-data">
                  <label class="col-sm-2 col-xs-5">客户地址：</label>
                  <div class="col-sm-7  col-xs-7">北京市西城区裕民中路145号院1单元18层1802</div>
                </div>  
                <div class="d-data">
                  <label class="col-sm-2 col-xs-5">联系电话：</label>
                  <div class="col-sm-7  col-xs-7">145944442139</div>
                </div>  
                <h3 class="title-1"><span>业务信息</span></h3>
                <div class="d-data">
                    <div class="lineWrap">
                          <label class="col-sm-4 col-xs-5 ">计费方式：</label>
                          <div class="col-sm-4  col-xs-7 ">宽带计费</div>
                    </div>
                    <div class="lineWrap">                     
                          <label class="col-sm-4 col-xs-5  line">付费方式：</label>
                          <div class="col-sm-4  col-xs-7 line-1">月付</div>
                     </div>                     
                </div> 
                 <div class="d-data">
                    <div class="lineWrap">
                       <label class="col-sm-4 ">带宽信息：</label>
                      <div class="col-sm-5 ">独享</div>
                    </div>

                  <div class="lineWrap">
                       <label class="col-sm-4 ">运营商：</label>
                       <div class="col-sm-5 ">联通</div> 
                  </div>                 
                </div>  
                 <div class="d-data">
                   <div class="lineWrap"> 
                      <label class="col-sm-4 col-xs-5">带宽：</label>
                      <div class="col-sm-4  col-xs-7"><#if current_order??>${current_order.ISP_speed!""}M</#if></div>
                 </div>
                  <div class="lineWrap">
                      <label class="col-sm-4 col-xs-5  line">时长：</label>
                      <div class="col-sm-4  col-xs-7 line-1">12个月</div> 
                  </div>  
                </div>  
                <hr>
                 <div class="d-data">
                  <label class="col-sm-2 col-xs-5 f16">订单价格：</label>
                  <div class="col-sm-7  col-xs-7"><em class="colC f25 fb"><#if current_order??>${current_order.cost_money!""}</em> 元</#if></div>
                </div>           
                <div class="form-group">
                    <div class="text-center">
                        <button type="button" class="btn btn-s btn-15" data-dismiss="modal">关闭</button>
                    </div>
                </div> 
           </div>
        </div>
    </div>
</div>
<!-- 付款 -->
<div class="modal fade" id="modal-24">
    <div class="modal-dialog">
        <div class="modal-content">
           <div class="modal-header">
               <a class="close" data-dismiss="modal">×</a>   
               <h4><span>付款</span></h4>
           </div>
           <div class="modal-body text-center">
                <form action="#" method="post">
                    <div class="form-group mb50">
                        <div class="col-xs-12 fn">
                            <div class="input-group">
                                <span class="input-group-addon input-left">支付密码：</span>
                                <input type="password" id="zhifumima" class="form-control input-220">
                            </div>
                        </div>
                    </div>
                     <div class="form-group">
                        <div class="text-center">
                            <!--<button type="button" class="btn btn-s btn-120 b-close" data-toggle="modal" data-target="#modal-25" data-dismiss="modal" data-backdrop="static">提交</button>-->
                            <button type="button" class="btn btn-s btn-120 b-close" onclick="verify_zfmm()">提交</button>
                            <button type="button" class="btn btn-s btn-120 reset ml80 " data-dismiss="modal">取消</button>
                        </div>
                    </div>               
                </form>
           </div>
        </div>
    </div>
</div>
<!-- 支付成功 -->
<div class="modal fade" id="modal-25">
    <div class="modal-dialog modal-400">
        <div class="modal-content">
           <div class="modal-header">
               <a class="close" data-dismiss="modal">×</a>   
           </div>
           <div class="modal-body text-center">
                <span class="glyphicon glyphicon-ok ok"></span><br/>
                <p class="h4 mt20">支付成功！</p>
                <p class="f14 col9"><span id="show">5</span> 秒钟后自动跳转至合同签订页面</p>
                <p class="text-right margin0"><a onclick="goto_contract()" class="colC">直接跳转 >></a></p>
           </div>
        </div>
    </div>
</div>
<!-- 取消 -->
<div class="modal fade" id="modal-26">
    <div class="modal-dialog">
        <div class="modal-content">
           <div class="modal-header">
               <a class="close" data-dismiss="modal">×</a>   
           </div>
           <div class="modal-body text-center">
                <p class="f14 colR plr2 mb30">订单一旦取消将无法恢复，您需要重新定制，请您谨慎操作，如果确认取消订单，请点击下方的确认按钮，因取消订单产生的一切后果请您自身承担，感谢您对于本平台的支持！</p>
                <div class="form-group">
                    <div class="text-center">
                        <!--<button type="button" class="btn btn-s btn-120" data-toggle="modal" data-target="#modal-27" data-dismiss="modal" data-backdrop="static">确定</button>-->
                        <button type="button" class="btn btn-s btn-120" onclick="concelOrder()">确定</button>
                        <button type="button" class="btn btn-s btn-120 reset ml80 " data-dismiss="modal">取消</button>
                    </div>
                </div> 
           </div>
        </div>
    </div>
</div>
<!-- 取消成功 -->
<div class="modal fade" id="modal-27">
    <div class="modal-dialog modal-400">
        <div class="modal-content">
           <div class="modal-header">
               <a class="close" data-dismiss="modal">×</a>   
           </div>
           <div class="modal-body text-center">
                <span class="glyphicon glyphicon-ok ok"></span><br/>
                <p class="h4 mtb20">订单取消成功！</p>
                <div class="form-group">
                    <div class="text-center">
                        <button type="button" class="btn btn-s btn-120" data-dismiss="modal">确定</button>
                    </div>
                </div> 
           </div>
        </div>
    </div>
</div>
<!-- 扩容扩租 -->
<div  class="modal fade" id="modal-28">
    <div class="modal-dialog modal-870">
        <div class="modal-content">
           <div class="modal-header">
               <a class="close" data-dismiss="modal">×</a>   
               <h4><span>扩容扩租</span></h4>
           </div>
           <div class="modal-body plr30">
                <div class="title-2 mb20">
                    <div class="t-left">
                        <h4 class="fb mb10">IDC业务</h4>
                        合同号：814920160201kxxx83
                    </div>
                    <div class="t-right">
                        <span>容量：5678M</span>
                        <span>已用空间：0M  </span>
                        <span>剩余空间：1658M</span>
                        <span>状态：正常</span>
                        <span>到期：1201-01-23</span>
                    </div>
                </div>

                <div class="use-age">
                    <h2 class="fl">扩充容量：</h2>
                    <div class="fl">
                        <div class="slider">
                            <div class="uc-slider fl">
                                <div id="slider" class="ui-slider ui-slider-horizontal ui-widget ui-widget-content ui-corner-all"></div>
                            </div>
                            <input name="tot_volume" value="1000"  class="cdn_text56" id="tot_volume" type="text">
                            <em class="re1_t1" style="line-height:42px">&nbsp;M</em>
                        </div>
                    </div>
                </div>
                <div class="use-age use-age-mt pr">
                    <h2 class="fl">租用时长：</h2>
                    <div class="fl">
                        <div class="slider">
                            <div class="uc-slider fl">
                                <div id="slider_time" class="ui-slider ui-slider-horizontal ui-widget ui-widget-content ui-corner-all"></div>                            
                            </div>
                            <input name="buy_num" class="cdn_text56" value="7" id="buy_num" type="text">
                            <em class="re1_t2" style="line-height:42px">&nbsp;月</em>
                        </div>
                    </div>
                </div>
                <div class="use-age f14"><h2 class="fl">扩充容量：</h2><span class="fl">5.1G</span></div>
                <div class="use-age f14  use-age-mt">      
                    <h2 class="fl f16">扩租时长：</h2>
                    <span class="fl">
                    <script>
                      var date=new Date();
                      var str=date.getFullYear()+"年"+(date.getMonth()+1)+"月"+date.getDate()+"日&nbsp;至";
                      document.write(str);
                    </script>
                    </span> 
                    <span  id="pDate">2016年12月29日</span>
                </div>
                <div class="use-age f14 use-age-mt">
                    <h2 class="fl">预算费用：</h2>
                    <span id="cost_money_show">容量：10M(4元/M/月) * 时长：7个月= 总计：280.00</span>
                    <span id="send_num_show"></span>
                    <input value="280.00" name="cost_money" id="cost_money" type="hidden">
                </div>
                <div class="form-group">
                    <div class="text-center">
                        <button type="button" class="btn btn-s btn-120" data-toggle="modal" data-target="#modal-29" data-dismiss="modal" data-backdrop="static">确认提交</button>
                        <button type="button" class="btn btn-s btn-120 reset ml80 " data-dismiss="modal">取消</button>
                    </div>
                </div> 
           </div>
        </div>
    </div>
</div>
<!-- 扩容扩租确定 -->
<div class="modal fade" id="modal-29">
    <div class="modal-dialog">
        <div class="modal-content">
           <div class="modal-header">
               <a class="close" data-dismiss="modal">×</a>   
           </div>
           <div class="modal-body text-center way  way-1">
                <form class="form-horizontal f15" method="post">
                   <div class="form-group">
                      <label class="col-sm-5 col-xs-4 control-label">扩充空间大小：</label>
                      <div class="col-sm-6   col-xs-7">
                          <p class="form-control-static text-left">10000M</p>
                      </div>
                   </div>
                    <div class="form-group">
                      <label class="col-sm-5 col-xs-4 control-label">扩充后结束时间：</label>
                      <div class="col-sm-6  col-xs-7" >
                          <p class="form-control-static text-left">2013年3月18日</p>
                      </div>
                   </div>                  
                   <div class="form-group">
                      <label class="col-sm-5 col-xs-4 control-label">应付金额：</label>
                      <div class="col-sm-6  col-xs-7">
                         <p class="form-control-static text-left">1500元</p>
                      </div>
                   </div>                  
                    <div class="form-group">
                      <div class="text-center">
                          <button type="button" class="btn btn-s btn-120"  data-toggle="modal" data-target="#modal-30" data-dismiss="modal" data-backdrop="static">确定</button>
                          <button type="button" class="btn btn-s btn-120 btn-cyan ml80" data-dismiss="modal">取消</button>
                      </div>
                  </div>                                
                </form>
           </div>
        </div>
    </div>
</div>
<!-- 扩容扩租支付 -->
<div class="modal fade" id="modal-30">
    <div class="modal-dialog modal-516">
        <div class="modal-content">
           <div class="modal-header">
               <a class="close" data-dismiss="modal">×</a>   
               <h4><span>支付密码</span></h4>
           </div>
           <div class="modal-body text-center">
                <form action="#" method="post">
                    <p class="tips f13">温馨提示：每日17：00前支付业务费用，将于次日0时开通，17：00后支
付费用将于后日0点开通，如有问题请联系400电话客服。</p>
                    <div class="form-group mb30">
                        <div class="col-xs-12 fn">
                            <div class="input-group">
                                <span class="input-group-addon input-left">支付密码：</span>
                                <input type="text" class="form-control input-220">
                                <a href="###" class="colB  line35" data-toggle="modal" data-target="#modal-1" data-backdrop="static" data-dismiss="modal">忘记密码 >></a>
                            </div>
                        </div>
                    </div>
                     <div class="form-group">
                        <div class="text-center">
                            <button type="button" class="btn btn-s btn-120 b-close" data-toggle="modal" data-target="#modal-25" data-dismiss="modal" data-backdrop="static">确定</button>
                            <button type="button" class="btn btn-s btn-120 reset ml80" data-dismiss="modal">取消</button>
                        </div>
                    </div>               
                </form>
           </div>
        </div>
    </div>
</div>
<!-- 忘记密码开始-->
<div class="modal fade" id="modal-1">
    <div class="modal-dialog">
        <div class="modal-content">
           <div class="modal-header">
               <a class="close" data-dismiss="modal">×</a>   
               <h4><span>忘记密码</span></h4>
           </div>
           <div class="modal-body text-center modal-pad">
               <a href="###" class="icon i-phone" data-toggle="modal" data-target="#modal-2" data-backdrop="static" data-dismiss="modal"><span>手机找回</span></a>
               <a href="###" class="icon i-mail" data-toggle="modal" data-target="#modal-4" data-backdrop="static" data-dismiss="modal"><span>邮箱找回</span></a>
           </div>
        </div>
    </div>
</div>
<!-- 手机找回 -->
<div class="modal fade" id="modal-2">
    <div class="modal-dialog modal-356">
        <div class="modal-content">
           <div class="modal-header">
               <a class="close" data-dismiss="modal">×</a>   
               <h4><span>手机找回</span></h4>
           </div>
           <div class="modal-body text-center">
                <form action="#" method="post">
                    <div class="form-group">
                        <div class="col-xs-12  ">
                            <div class="input-group">
                                <span class="input-group-addon"><span class="glyphicon glyphicon-user"></span></span>
                                <input type="text" name="username" class="form-control" placeholder="请输入账号">
                            </div>
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="col-xs-12  ">
                            <div class="input-group">
                                <span class="input-group-addon"><span class="glyphicon glyphicon-edit"></span></span>
                                <input type="text"   class="form-control input-160" placeholder="请输入验证码">
                                <a href="###" class="btn btn-y ml10 code">获取验证码</a>
                                <a href="###" class="btn btn-c ml10 code-1 d-none">重新发送</a>
                            </div>
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="col-xs-12  ">
                            <div class="input-group">
                                <span class="input-group-addon"><span class="glyphicon glyphicon-lock"></span></span>
                                <input type="text"  class="form-control" placeholder="请输入密码">
                            </div>
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="col-xs-12  ">
                            <div class="input-group">
                                <span class="input-group-addon"><span class="glyphicon glyphicon-lock"></span></span>
                                <input type="text"   class="form-control" placeholder="请再次输入密码">
                            </div>
                        </div>
                    </div>
                     <div class="form-group">
                        <div class="text-center">
                            <button type="button" class="btn btn-s btn-40" data-toggle="modal" data-target="#modal-3" data-dismiss="modal" data-backdrop="static">确认</button>
                            <button type="button" class="btn btn-s btn-40 ml4" data-dismiss="modal">取消</button>
                        </div>
                    </div>               
                </form>
           </div>
        </div>
    </div>
</div>
<!-- 手机找回成功 -->
<div class="modal fade" id="modal-3">
    <div class="modal-dialog modal-400">
        <div class="modal-content">
           <div class="modal-header">
               <a class="close" data-dismiss="modal">×</a>   
           </div>
           <div class="modal-body text-center">
                <span class="glyphicon glyphicon-ok ok"></span><br/>
                <p class="h4 mt20">密码修改成功</p>
           </div>
        </div>
    </div>
</div>
<!-- 邮箱找回 -->
<div class="modal fade" id="modal-4">
    <div class="modal-dialog modal-516">
        <div class="modal-content">
           <div class="modal-header">
               <a class="close" data-dismiss="modal">×</a>   
               <h4><span>邮箱找回</span></h4>
           </div>
           <div class="modal-body text-center">
                <form action="#" method="post">
                    <p class="tips f13">输入绑定邮箱，发送验证邮件，您的绑定邮箱会接收到一封验证邮件，请在
24小时之内打开邮件内的验证链接完成支付密码修改业务。</p>
                    <div class="form-group mb30">
                        <div class="col-xs-12 fn">
                            <div class="input-group">
                                <span class="input-group-addon input-left">账号绑定邮箱：</span>
                                <input type="text" class="form-control input-220">
                            </div>
                        </div>
                    </div>
                     <div class="form-group">
                        <div class="text-center">
                            <button type="button" class="btn btn-s btn-120" data-toggle="modal" data-target="#modal-5" data-dismiss="modal" data-backdrop="static">发送</button>
                            <button type="button" class="btn btn-s btn-120 ml80" data-dismiss="modal">取消</button>
                        </div>
                    </div>               
                </form>
           </div>
        </div>
    </div>
</div>
<!-- 验证邮件成功 -->
<div class="modal fade" id="modal-5">
    <div class="modal-dialog modal-400">
        <div class="modal-content">
           <div class="modal-header">
               <a class="close" data-dismiss="modal">×</a>   
           </div>
           <div class="modal-body text-center">
                <span class="glyphicon glyphicon-ok ok"></span><br/>
                <p class="h4 mt20">验证邮件发送成功</p>
                <p class="f14 col9">请您于24小时内完成验证</p>
           </div>
        </div>
    </div>
</div>
<!-- 验证邮件失败 -->
<div class="modal fade" id="modal-6">
    <div class="modal-dialog modal-400">
        <div class="modal-content">
           <div class="modal-header">
               <a class="close" data-dismiss="modal">×</a>   
           </div>
           <div class="modal-body text-center">
                <span class="glyphicon glyphicon-remove remove"></span><br/>
                <p class="h4 mt20">验证邮件发送失败</p>
                <p class="f14 col9">请重新验证</p>
           </div>
        </div>
    </div>
</div>

 
<#include "foot_bus.ftl">